<!--
 * @Author: chenhuanhuan 2925102113@qq.com
 * @Date: 2024-08-26 14:57:33
 * @LastEditors: chenhuanhuan 2925102113@qq.com
 * @LastEditTime: 2024-09-03 12:04:00
 * @FilePath: \orderApp\packageOne\pages\personalInfo\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<route lang="json5" type="page">
{
  layout: "default",
  style: {
    navigationStyle: "custom",
    navigationBarTextStyle: "black",
  },
}
</route>

<template>
  <view class="">
    <cu-navbar title="我的点赞" :border="true"></cu-navbar>
    <cu-slider :list="likeListInfo" :height="offsetTop" contentColor="#f3f3f4">
      <template v-slot:default="{ data, index }">
        <view>
          <scroll-view
            v-if="data.likeList.length"
            class="height"
            :style="{ '--height': offsetTop + 'px' }"
            :scroll-y="true"
            @scrolltolower="scrolltolower(index)"
          >
            <view v-if="!index" style="padding-right: 30.77rpx">
              <dishesComment
                v-for="(item, ind) in data.likeList"
                :itemData="item"
                :itemIdx="ind"
                :key="ind"
                @changelike="onUnlikeDish(ind)"
              ></dishesComment>
            </view>
            <view v-else style="padding-right: 30.77rpx">
              <reviewComment
                v-for="(item, ind) in data.likeList"
                :itemData="item"
                :itemIdx="ind"
                :key="ind"
                @changelike="onUnlikeReview(ind)"
              ></reviewComment>
            </view>
            <uv-load-more
              line
              :status="data.loadMore.status"
              :loading-text="data.loadMore.loadingText"
              :loadmore-text="data.loadMore.loadmoreText"
              :nomore-text="data.loadMore.nomoreText"
            />
          </scroll-view>
          <view v-else>
            <cu-empty></cu-empty>
          </view>
        </view>
      </template>
    </cu-slider>
  </view>
</template>

<script lang="ts" setup>
import { reqDeleteLikeEvaluater, reqLikeComplain } from "@/service/business/goods";
import { reqMyLike } from "@/service/business/login";
import dishesComment from "@/pages/components/dishesComment.vue";
import reviewComment from "@/pages/components/reviewComment.vue";
import { useUserStore } from "@/store";

const offsetTop = ref(useUserStore().pinia_SafeVal.top + 44);
const { user } = useUserStore().userInfo;
const likeListInfo = ref([
  {
    name: "菜品评论点赞",
    id: 0,
    pageInfo: {
      size: 10,
      current: 1,
      total: null,
    },
    likeList: [],
    loadMore: {
      status: "loading",
      loadingText: "努力加载中",
      loadmoreText: "上拉或点击加载更多",
      nomoreText: "到底啦",
    },
  },
  {
    name: "伙食评议点赞",
    id: 1,
    pageInfo: {
      size: 10,
      current: 1,
      total: null,
    },
    likeList: [],
    loadMore: {
      status: "loading",
      loadingText: "努力加载中",
      loadmoreText: "上拉或点击加载更多",
      nomoreText: "到底啦",
    },
  },
]);

// 取消菜肴评价点赞
const onUnlikeDish = (index) => {
  uni.showLoading({
    title: "操作中",
    mask: true,
  });
  const { evaluateId } = likeListInfo.value[0].likeList[index];
  return new Promise<void>((resolve, reject) => {
    reqDeleteLikeEvaluater({ userId: user.userId, evaluateId }).then((res) => {
      if (res.retCode == 2000) {
        likeListInfo.value[0].likeList.splice(index, 1);
        uni.hideLoading();
      }
    });
  });
};

// 改变就餐评议点赞状态
const onUnlikeReview = (index) => {
  let { adviceId } = likeListInfo.value[1].likeList[index];
  reqLikeComplain({
    userId: user.userId,
    adviceId,
  }).then((res) => {
    likeListInfo.value[1].likeList.splice(index, 1);
    uni.hideLoading();
  });
};

// 触底加载更多
const scrolltolower = (index) => {
  loadMoreFn(index);
};

const loadMoreFn = (index) => {
  if (
    likeListInfo.value[index].pageInfo.current >=
    Math.ceil(
      likeListInfo.value[index].pageInfo.total / likeListInfo.value[index].pageInfo.size
    )
  ) {
    likeListInfo.value[index].loadMore.status = "nomore";
    return false;
  }
  likeListInfo.value[index].pageInfo.current++;
  getMyLike(index);
};

const likeList = ref([]);
const getMyLike = (index) => {
  uni.showLoading({
    title: "加载中",
    mask: true,
  });
  likeListInfo.value[index].loadMore.status = "loading";
  let params = {
    size: likeListInfo.value[index].pageInfo.size,
    current: likeListInfo.value[index].pageInfo.current,
    userId: user.userId,
    sign: index,
  };
  reqMyLike(params).then((res) => {
    if (res.retCode == 2000) {
      uni.hideLoading();
      likeListInfo.value[index].likeList.push(...res.data);
      likeListInfo.value[index].pageInfo.total = res.total;
      if (
        likeListInfo.value[index].pageInfo.current <
        Math.ceil(res.total / likeListInfo.value[index].pageInfo.size)
      ) {
        likeListInfo.value[index].loadMore.status = "loadmore";
      } else {
        likeListInfo.value[index].loadMore.status = "nomore";
      }
    }
  });
};

onMounted(() => {
  getMyLike(0);
  getMyLike(1);
});
</script>

<style lang="scss" scoped>
//
.wrap {
  padding: 24rpx;
}
.height {
  height: calc(100vh - var(--height) - 216.92rpx);
}
</style>
